﻿<UserControl x:Class="Mido.UiModules.ScrollBarModule.ScrollBarView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:ScrollBarModule="clr-namespace:Mido.UiModules.ScrollBarModule" mc:Ignorable="d" d:DesignHeight="60" d:DesignWidth="311"
             d:DataContext="{x:Static ScrollBarModule:ScrollBarViewModel.Designer}">

	<Grid x:Name="LayoutRoot">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        
        <ProgressBar Visibility="{Binding ProgressVisibility, Mode=OneWay}" Value="{Binding ProgressPercents, Mode=OneWay}" Height="5"/>
        
        <ListBox x:Name="lbImages" ScrollViewer.VerticalScrollBarVisibility="Disabled" ScrollViewer.HorizontalScrollBarVisibility="Auto" Height="80"
                             SelectedItem="{Binding SelectedImage}" ItemsSource="{Binding Images}" Background="Transparent" BorderBrush="Transparent" Grid.Row="1">
			<ListBox.ItemsPanel>
				<ItemsPanelTemplate>
					<VirtualizingStackPanel IsItemsHost="True" Orientation="Horizontal"/>
				</ItemsPanelTemplate>
			</ListBox.ItemsPanel>
			<ListBox.ItemContainerStyle>
				<Style TargetType="{x:Type ListBoxItem}">
					<Setter Property="BorderBrush" Value="Gray"/>
					<Setter Property="Margin" Value="1"/>
					<Setter Property="Template">
						<Setter.Value>
							<ControlTemplate TargetType="{x:Type ListBoxItem}">
								<Border  x:Name="Bd" SnapsToDevicePixels="true"  Background="#EEFFFFFF" BorderBrush="{TemplateBinding BorderBrush}" HorizontalAlignment="Center" VerticalAlignment="Center" BorderThickness="{TemplateBinding BorderThickness}">
									<Grid>
                                        <Button x:Name="ExcludeButton" Command="{Binding ExcludeCommand}" HorizontalAlignment="Right" VerticalAlignment="Top" Panel.ZIndex="1" BorderThickness="0" Visibility="Hidden"
                                                ToolTip="Exclude">
                                            <Button.Template>
                                                <ControlTemplate>
                                                    <Grid>
                                                        <Rectangle Fill="Transparent"/>
                                                        <Polygon Width="10" Height="10" Stretch="Fill" Fill="Black" Stroke="White" Points="66.498,16.166 83.459,33.127 66.498,50.089 83.459,67.05 66.498,84.014 49.535,67.05 32.573,84.014 15.611,67.05    32.573,50.089 15.611,33.127 32.573,16.166 49.535,33.127  "/>
                                                    </Grid>
                                                </ControlTemplate>
                                            </Button.Template>
                                        </Button>
                                        
                                        <Image x:Name="img" Source="{Binding Path=SmallImage, Mode=OneWay}" Height="64" Stretch="UniformToFill" Width="64" Panel.ZIndex="0">
											<Image.ToolTip>
												<ToolTip Content="{Binding Path=ToolTipText}"/>
											</Image.ToolTip>
										</Image>
									</Grid>
								</Border>
                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter TargetName="ExcludeButton" Property="Visibility" Value="Visible"/>
                                    </Trigger>
                                </ControlTemplate.Triggers>
							</ControlTemplate>
						</Setter.Value>
					</Setter>
					<Style.Triggers>
						<Trigger Property="IsSelected" Value="True">
                            <Setter Property="Margin" Value="0"/>
                            <Setter Property="BorderBrush" Value="{StaticResource DefaultAppBrush}"/>
                            <Setter Property="BorderThickness" Value="2"/>
						</Trigger>
					</Style.Triggers>
				</Style>
			</ListBox.ItemContainerStyle>
		</ListBox>
	</Grid>
</UserControl>
